﻿<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>pc点击登录</title>
    <link rel="stylesheet" href="css/login_ercode.css">


</head>

<body>
    <!-- 
        #0084ff
        color: #0084FF;
     -->
    <div class="main">
        <div class="main_bg">
            <div class="loginBox">
                <!-- signContent -->
                <div class="signContent">
                    <div class="signContainer">
                        <form action="" class="loginForm" id="form_key" data-module="smsFrom" onsubmit="return checkForm()">
                            <!-- tab -->
                            <div class="tabBox">
                                <div class="tabBoxSwitch">
                                    <ul class="tabBoxSwitchUl">
                                        <li class="tab-active" data-id="0">免密码登录</li>
                                        <li data-id="1">密码登录</li>
                                    </ul>
                                    <div class="ercode_tab swicth-ercode">
                                        <svg width="52" height="52" xmlns:xlink="http://www.w3.org/1999/xlink"
                                            fill="currentColor">
                                            <defs>
                                                <path id="id-3938311804-a" d="M0 0h48a4 4 0 0 1 4 4v48L0 0z"></path>
                                            </defs>
                                            <g fill="none" fill-rule="evenodd">
                                                <mask id="id-3938311804-b" fill="#fff">
                                                    <use xlink:href="#id-3938311804-a"></use>
                                                </mask>
                                                <use fill="#0084FF" xlink:href="#id-3938311804-a"></use>
                                                <image width="52" height="52" mask="url(#id-3938311804-b)"
                                                    xlink:href="">
                                                </image>
                                            </g>
                                        </svg>
                                    </div>
                                </div>
                            </div>
                            <!-- tabContent -->
                            <div class="tabContent">
                                <!-- tabContentPhone -->
                                <div class="tabcont  tabContentPhone active">
                                    <div class="tabcontent">
                                        <div class="phoneBox">
                                            <div class="phoneGroup">
                                                <button class="phone-btn selectBtn" type="button" data-type="selected">
                                                    <span>中国 +86</span>
                                                    <svg class="Zi--Select Select-arrow" fill="currentColor"
                                                        viewBox="0 0 24 24">
                                                        <path
                                                            d="M12 16.183l2.716-2.966a.757.757 0 0 1 1.064.001.738.738 0 0 1 0 1.052l-3.247 3.512a.758.758 0 0 1-1.064 0L8.22 14.27a.738.738 0 0 1 0-1.052.758.758 0 0 1 1.063 0L12 16.183zm0-9.365L9.284 9.782a.758.758 0 0 1-1.064 0 .738.738 0 0 1 0-1.052l3.248-3.512a.758.758 0 0 1 1.065 0L15.78 8.73a.738.738 0 0 1 0 1.052.757.757 0 0 1-1.063.001L12 6.818z"
                                                            fill-rule="evenodd"></path>
                                                    </svg>
                                                </button>
                                            </div>
                                            <div class="selectConentent">
                                                <div class="selectOptions">
                                                </div>
                                            </div>
                                        </div>
                                        <span class="line-show"></span>
                                        <div class="phoneInputGroup">
                                            <label for="" class="inputLabel phoneLabel">
                                                <input type="text" value="" name="" id="phoneInput"
                                                    class="inputStyle phoneInput" placeholder="手机号" autocomplete="off">
                                            </label>
                                        </div>
                                    </div>
                                    <div class="tabcontent">
                                        <div class="phoneInputGroup">
                                            <label for="" class="inputLabel">
                                                <input type="number" value="" name="" id="msgInput"
                                                    class="inputStyle msgInput" placeholder="输入 6 位短信验证码"
                                                    autocomplete="off">
                                            </label>
                                        </div>
                                        <div class="phoneGroup">
                                            <button class="phone-btn msgBtn" type="button">
                                                获取短信验证码
                                            </button>
                                        </div>
                                    </div>
                                </div>
                                <!-- tabContentAccount -->
                                <div class="tabcont tabContentAccount">
                                    <div class="tabcontent">
                                        <div class="login-out-phoneBox">
                                            <div class="phoneBox">
                                                <div class="phoneGroup">
                                                    <button class="phone-btn selectBtn" type="button"
                                                        data-type="selected">
                                                        <span>中国 +86</span>
                                                        <svg class="Zi--Select Select-arrow" fill="currentColor"
                                                            viewBox="0 0 24 24">
                                                            <path
                                                                d="M12 16.183l2.716-2.966a.757.757 0 0 1 1.064.001.738.738 0 0 1 0 1.052l-3.247 3.512a.758.758 0 0 1-1.064 0L8.22 14.27a.738.738 0 0 1 0-1.052.758.758 0 0 1 1.063 0L12 16.183zm0-9.365L9.284 9.782a.758.758 0 0 1-1.064 0 .738.738 0 0 1 0-1.052l3.248-3.512a.758.758 0 0 1 1.065 0L15.78 8.73a.738.738 0 0 1 0 1.052.757.757 0 0 1-1.063.001L12 6.818z"
                                                                fill-rule="evenodd"></path>
                                                        </svg>
                                                    </button>
                                                </div>
                                                <div class="selectConentent">
                                                    <div class="selectOptions">
                                                    </div>
                                                </div>
                                            </div>
                                            <span class="line-show"></span>
                                        </div>

                                        <div class="phoneInputGroup">
                                            <label for="" class="inputLabel phoneLabel">
                                                <input type="text" value="" name="" id="accountUser"
                                                    class="inputStyle accountUsername" placeholder="手机号或邮箱"
                                                    autocomplete="off">
                                            </label>
                                        </div>
                                    </div>
                                    <div class="tabcontent">
                                        <div class="phoneInputGroup">
                                            <label for="" class="inputLabel phoneLabel">
                                                <input type="password" value="" name="" id="accountpwd"
                                                    class="inputStyle accountPwd" placeholder="密码" autocomplete="off">
                                            </label>

                                        </div>
                                        <button tabindex="-1" type="button" class="button SignFlow-switchPassword">
                                            <span style="display: inline-flex; align-items: center;">​
                                                <svg class="Zi Zi--Eye Button-zi" fill="currentColor"
                                                    viewBox="0 0 24 24" width="1.2em" height="1.2em">
                                                    <path
                                                        d="M1 11.5C1 15 7 19 12 19s11-4 11-7.5S17 4 12 4 1 8 1 11.5zm11 5c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm-3-5c0 1.66 1.34 3 3 3s3-1.34 3-3-1.34-3-3-3-3 1.34-3 3z"
                                                        fill-rule="evenodd">
                                                    </path>
                                                </svg>
                                            </span>
                                        </button>
                                    </div>
                                </div>
                            </div>
                            <!-- loginbox -->
                            <div class="login_box">
                                <button type="button" class="phone-btn out-login-btn-shw out-login-btn SignFlow-switchLogin"
                                    data-btn="out-login-btn" data-clilck="isClick">海外手机登录</button>
                                <button type="button" class="phone-btn voice-btn sms-voice-btn" data-btn="sms-voice-btn"
                                    data-forV="forget-voice">接收语音验证码</button>
                            </div>
                            <button id="submit" type="submit" class="button fromSubmit"
                                data-type="smsSubmit">注册/登录</button>
                            <!-- tips -->
                            <div class="SignContainer-tip">
                                <div>
                                    <div>未注册手机验证后自动登录，注册即代表同意<a href="#">《乎乎协议》</a><a href="#">《隐私保护指引》</a></div>
                                </div>
                            </div>
                        </form>
                        <!-- ercodeSgin -->
                        <div class="ercodeSignBox">
                            <div class="ercode_tab switch-input">
                                <svg width="52" height="52" xmlns:xlink="http://www.w3.org/1999/xlink"
                                    fill="currentColor">
                                    <defs>
                                        <path id="id-14580708-a" d="M0 0h48a4 4 0 0 1 4 4v48L0 0z"></path>
                                    </defs>
                                    <g fill="none" fill-rule="evenodd">
                                        <mask id="id-14580708-b" fill="#fff">
                                            <use xlink:href="#id-14580708-a"></use>
                                        </mask>
                                        <use fill="#0084FF" xlink:href="#id-14580708-a"></use>
                                        <path fill="#FFF"
                                            d="M22.125 4h13.75A4.125 4.125 0 0 1 40 8.125v27.75A4.125 4.125 0 0 1 35.875 40h-13.75A4.125 4.125 0 0 1 18 35.875V8.125A4.125 4.125 0 0 1 22.125 4zm6.938 34.222c1.139 0 2.062-.945 2.062-2.11 0-1.167-.923-2.112-2.063-2.112-1.139 0-2.062.945-2.062 2.111 0 1.166.923 2.111 2.063 2.111zM21 8.333v24h16v-24H21z"
                                            mask="url(#id-14580708-b)"></path>
                                        <g mask="url(#id-14580708-b)">
                                            <path fill="#FFF"
                                                d="M46.996 15.482L39 19.064l-7.996-3.582A1.6 1.6 0 0 1 32.6 14h12.8a1.6 1.6 0 0 1 1.596 1.482zM47 16.646V24.4a1.6 1.6 0 0 1-1.6 1.6H32.6a1.6 1.6 0 0 1-1.6-1.6v-7.754l8 3.584 8-3.584z">
                                            </path>
                                            <path fill="#0084FF" d="M31 15.483v1.17l8 3.577 8-3.577v-1.17l-8 3.581z"
                                                fill-rule="nonzero"></path>
                                        </g>
                                    </g>
                                </svg>
                            </div>
                            <!-- ercodeConent -->
                            <div class="ercodeContent">
                                <div class="Qrcode-title">扫码登录</div>
                                <div class="ercodeBox">
                                    <div class="Qrcode-img" id="qrcode">
                                        <!-- <img width="150" height="150" src="../img/image.png" alt="二维码"> -->
                                    </div>
                                    <p>打开<a href="#" target="_blank" rel="noopener noreferrer">
                                            乎乎 App</a></p>
                                    <p>在「我的」页面右上角打开扫一扫</p>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <!--  -->
                <div class="css-1hmxk26"></div>
                <!-- signSocial -->
                <div class="footSign signSocial">
                    <span class="social-title">社交帐号登录</span>
                    <span class="Login-socialButtonGroup">
                        <button type="button" class="button Login-socialButton">
                            <svg class="Zi Zi--WeChat Login-socialIcon" fill="#60c84d" viewBox="0 0 24 24" width="20"
                                height="20">
                                <path
                                    d="M2.224 21.667s4.24-1.825 4.788-2.056C15.029 23.141 22 17.714 22 11.898 22 6.984 17.523 3 12 3S2 6.984 2 11.898c0 1.86.64 3.585 1.737 5.013-.274.833-1.513 4.756-1.513 4.756zm5.943-9.707c.69 0 1.25-.569 1.25-1.271a1.26 1.26 0 0 0-1.25-1.271c-.69 0-1.25.569-1.25 1.27 0 .703.56 1.272 1.25 1.272zm7.583 0c.69 0 1.25-.569 1.25-1.271a1.26 1.26 0 0 0-1.25-1.271c-.69 0-1.25.569-1.25 1.27 0 .703.56 1.272 1.25 1.272z"
                                    fill-rule="evenodd"></path>
                            </svg>
                            微信
                        </button>
                        <button type="button" class="button Login-socialButton ">
                            <svg class="Zi Zi--QQ Login-socialIcon" fill="#50c8fd" viewBox="0 0 24 24" width="20"
                                height="20">
                                <path
                                    d="M12.003 2c-2.265 0-6.29 1.364-6.29 7.325v1.195S3.55 14.96 3.55 17.474c0 .665.17 1.025.281 1.025.114 0 .902-.484 1.748-2.072 0 0-.18 2.197 1.904 3.967 0 0-1.77.495-1.77 1.182 0 .686 4.078.43 6.29 0 2.239.425 6.287.687 6.287 0 0-.688-1.768-1.182-1.768-1.182 2.085-1.77 1.905-3.967 1.905-3.967.845 1.588 1.634 2.072 1.746 2.072.111 0 .283-.36.283-1.025 0-2.514-2.166-6.954-2.166-6.954V9.325C18.29 3.364 14.268 2 12.003 2z"
                                    fill-rule="evenodd">
                                </path>
                            </svg>
                            QQ
                        </button>
                        <button type="button" class="button Login-socialButton">
                            <svg class="Zi Zi--Weibo Login-socialIcon" fill="#fb6622" viewBox="0 0 24 24" width="20"
                                height="20">
                                <path fill="#FB6622"
                                    d="M15.518 3.06c8.834-.854 7.395 7.732 7.394 7.731-.625 1.439-1.673.309-1.673.309.596-7.519-5.692-6.329-5.692-6.329-.898-1.067-.029-1.711-.029-1.711zm4.131 6.985c-.661 1.01-1.377.126-1.376.126.205-3.179-2.396-2.598-2.396-2.598-.719-.765-.091-1.346-.091-1.346 4.882-.551 3.863 3.818 3.863 3.818zM5.317 7.519s4.615-3.86 6.443-1.328c0 0 .662 1.08-.111 2.797.003-.003 3.723-1.96 5.408.159 0 0 .848 1.095-.191 2.649 0 0 2.918-.099 2.918 2.715 0 2.811-4.104 6.44-9.315 6.44-5.214 0-8.026-2.092-8.596-3.102 0 0-3.475-4.495 3.444-10.33zm10.448 7.792s.232-4.411-5.71-4.207c-6.652.231-6.579 4.654-6.579 4.654.021.39.097 3.713 5.842 3.713 5.98 0 6.447-4.16 6.447-4.16zm-9.882.86s-.059-3.632 3.804-3.561c3.412.06 3.206 3.165 3.206 3.165s-.026 2.979-3.684 2.979c-3.288 0-3.326-2.583-3.326-2.583zm2.528 1.037c.672 0 1.212-.447 1.212-.998 0-.551-.543-.998-1.212-.998-.672 0-1.215.447-1.215.998 0 .551.546.998 1.215.998z"
                                    fill-rule="evenodd">
                                </path>
                            </svg>
                            微博
                        </button>
                    </span>
                </div>
                <!-- signDownload -->
                <div class="footSign signDownload">
                    <div class="css-eow14e rt"> 
                        <button class="button css-c01qo8" type="button">
                            <span style="display: inline-flex; align-items: center;">​
                                <svg width="20" height="20" class="css-vfpo4o" fill="currentColor">
                                    <g fill="none" fill-rule="evenodd">
                                        <path fill="#0084FF"
                                            d="M15.234 0C18.125 0 20 1.875 20 4.766v10.468C20 18.125 18.125 20 15.234 20H4.766C1.875 20 0 18.125 0 15.234V4.766C0 1.875 1.875 0 4.766 0h10.468z">
                                        </path>
                                        <path d="M0 0h20v20H0z"></path>
                                        <path fill="#FFF"
                                            d="M10.313 10.352c0-.012-.004-1.036-.328-1.055h-2.26a48.42 48.42 0 0 0 .095-3.164h2.21c0-.003.084-.982-.37-.977H5.837c.15-.563.34-1.15.566-1.758 0 0-1.039 0-1.393.937-.146.386-.57 1.87-1.325 3.388.254-.028 1.095-.05 1.59-.963.091-.255.109-.289.222-.627h1.246c0 .452-.051 2.897-.072 3.164H4.414c-.507.019-.672 1.043-.672 1.055h2.832c-.19 2.15-1.209 3.972-3.058 5.413.884.253 1.766-.04 2.202-.43 0 0 .992-.906 1.536-3.004l2.33 2.817s.342-1.166-.053-1.734c-.328-.387-1.212-1.434-1.589-1.814l-.631.504a7.686 7.686 0 0 0 .34-1.752h2.662zM10.898 5v9.441h1.015l.334 1.145 1.82-1.144h2.144V5h-5.313zm4.258 8.398h-1.214l-1.212.782-.22-.782h-.518V6.016h3.164v7.382z">
                                        </path>
                                    </g>
                                </svg>
                            </span>
                            下载乎乎 App
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    <script src="js/jquery-1.10.2.js"></script>
    <script src="js/login.js"></script>
    <script src="js/qrcode.js"></script>
    <!-- <svg width="52" height="52" xmlns:xlink="http://www.w3.org/1999/xlink" fill="currentColor"><defs><path id="id-14580708-a" d="M0 0h48a4 4 0 0 1 4 4v48L0 0z"></path></defs><g fill="none" fill-rule="evenodd"><mask id="id-14580708-b" fill="#fff"><use xlink:href="#id-14580708-a"></use></mask><use fill="#0084FF" xlink:href="#id-14580708-a"></use><path fill="#FFF" d="M22.125 4h13.75A4.125 4.125 0 0 1 40 8.125v27.75A4.125 4.125 0 0 1 35.875 40h-13.75A4.125 4.125 0 0 1 18 35.875V8.125A4.125 4.125 0 0 1 22.125 4zm6.938 34.222c1.139 0 2.062-.945 2.062-2.11 0-1.167-.923-2.112-2.063-2.112-1.139 0-2.062.945-2.062 2.111 0 1.166.923 2.111 2.063 2.111zM21 8.333v24h16v-24H21z" mask="url(#id-14580708-b)"></path><g mask="url(#id-14580708-b)"><path fill="#FFF" d="M46.996 15.482L39 19.064l-7.996-3.582A1.6 1.6 0 0 1 32.6 14h12.8a1.6 1.6 0 0 1 1.596 1.482zM47 16.646V24.4a1.6 1.6 0 0 1-1.6 1.6H32.6a1.6 1.6 0 0 1-1.6-1.6v-7.754l8 3.584 8-3.584z"></path><path fill="#0084FF" d="M31 15.483v1.17l8 3.577 8-3.577v-1.17l-8 3.581z" fill-rule="nonzero"></path></g></g></svg> -->
</body>

</html>